Cascading Selection Lists

Description

There are many cases when an application needs to display a dynamic selection list. The following example displays a list of unique state values in one list box. When the user makes a selection, the second list box displays a list of cities for that state.

Creating the Dialog and Controls

  1. Create a new dialog web component.

  2. Display the Form Controls page.

  3. Select "Dropdownbox" in the Control Types list and click the '>' icon.

  4. Enter "State" in the Name field, click Make label same as name, and click OK.

  5. Select "Dropdownbox" in the Control Types list and click the '>' icon.

  6. Enter "City" in the Name field, click Make label same as name, and click OK.

  7. Select "Dropdownbox" in the Control Types list and click the '>' icon.

  8. Enter "Last Name" in the Name field, click Make label same as name, and click OK.

Populating the Lists When Using Alpha Anywhere

  1. Select "State" in the Selected Controls list.

  2. In the Control Settings > Control type list select "Drop Down Box".

  3. Click the '...' button in the DropDownBox Properties > Choices field.

    • 1. In the Define Choices > List Type field select "Dynamic".

    • 2. In the Data Source > Data source type field select "DBF-Table".

    • 3. In the Data Source > Table name field select "Customer".

    • 4. In the Data Source > Display value field/expression field click the '...' button, click Field Name, select "Bill_State_Region", and click Insert > OK.

    • 5. In the Additional Choices (Pre) section, add a single entry, a pipe character (|). This will ensure that there is always a value to select. The | will cause a blank entry at the top of the list.

    • 6. Click OK to return to the Dialog Builder.

    • 7. Enter "width: 2in;" into the DropDownBox Properties > In-line style field.

  4. Select "City" in the Selected Controls list.

  5. In the Control Settings > Control type list select "Drop Down Box".

  6. Click the '...' button in the DropDownBox Properties > Choices field.

    • 1. In the Define Choices > List Type field select "Dynamic".

    • 2. In the Data Source > Data source type field select "DBF-Table".

    • 3. In the Data Source > Table name field select "Customer".

    • 4. In the Data Source > Display value field/expression field click '...', click Field Name, select "Bill_city", and click Insert > OK.

    • 5. In the Additional Choices (Pre) section, add a single entry, a pipe character (|). This will ensure that there is always a value to select. The | will cause a blank entry at the top of the list.

    • 6. In the Data Source > Filter field click '...' to display the Filter Expression dialog.

    • 7. Enter "Bill_State_Region = ?" (without the quotes). This expression says that the Bill_City values that are returned will be filtered by the previous selected value of Bill_State_Region.

    • 8. Display the Parameter Mapping tab.

    • 9. Select "Variable" in the Parameter maps to a list.

    • 10. Select "State" in the Variable name list.

    • 11. Select "Character" in the Parameter type list.

    • 12. Click OK to return to the Dialog Builder.

    • 13. Enter "width: 2in;" into the DropDownBox Properties > In-line style field.

    • 14. Select "Do nothing" in the DropDownBox Properties > Not in list rule list. This choice prevents the last selection in the drop down list from appearing when the user selects a different value for Bill_State_Region.

  7. Select "Last_Name" in the Selected Controls list.

  8. In the Control Settings > Control type list select "Drop Down Box".

  9. Click the '...' button in the DropDownBox Properties > Choices field.

    • In the Define Choices > List Type field select "Dynamic".

    • In the Data Source > Data source type field select "DBF-Table".

    • In the Data Source > Table name field select "Customer".

    • In the Data Source > Display value field/expression field click the '...' button, click Field Name, select "Lastname", and click Insert > OK.

    • In the Data Source > Filter field click the '...' button to display the Filter Expression dialog.

    • Enter "Bill_State_Region = ?" (without the quotes). This expression says that the Lastname values that are returned will be filtered by the previous selected values of Bill_State_Region and Bill_City.

    • Display the Parameter Mapping tab.

    • Select "Parameter 1".

    • Select "Variable" in the Parameter maps to a list.

    • Select "City" in the Variable name list.

    • Select "Character" in the Parameter type list.

    • Select "Parameter 2".

    • Select "Variable" in the Parameter maps to a list.

    • Select "State" in the Variable name list.

    • Select "Character" in the Parameter type list.

    • In the Additional Choices (Pre) section, add a single entry, a pipe character (|). This will ensure that there is always a value to select. The | will cause a blank entry at the top of the list.

    • Click OK > OK to return to the Dialog Builder.

    • Enter "width: 2in;" into the DropDownBox Properties > In-line style field.

    • Select "Do nothing" in the DropDownBox Properties > Not in list rule list. This choice prevents the last selection in the drop down list from appearing when the user selects a different value for Bill_City.

Populating the Lists when Using a SQL Database

  1. Select "State" in the Selected Controls list.

  2. In the Control Settings > Control type list select "Drop Down Box".

  3. Click the '...' button in the DropDownBox Properties > Choices field.

    • 1. In the Define Choices > List Type field select "Dynamic".

    • 2. In the Data Source > Use saved connection string field select "True".

    • 3. In the Data Source > AlphaDAO Connection string name list select your connection string.

    • 4. In the Data Source > AlphaDAO SQL SELECT statement field click the '...' button to display the SQL SELECT dialog.

    • 5. In the Data Source > Table list select "Customer".

    • 6. In the Data Source > Field to display list select "Bill_State_Region".

    • 7. Click OK > OK to return to the Dialog Builder.

    • 8. Enter "width: 2in;" into the DropDownBox Properties > In-line style field.

  4. Select "City" in the Selected Controls list.

  5. In the Control Settings > Control type list select "Drop Down Box".

  6. Click the '...' button in the DropDownBox Properties > Choices field.

    • 1. In the Define Choices > List Type field select "Dynamic".

    • 2. In the Data Source > Use saved connection string field select "True".

    • 3. In the Data Source > AlphaDAO Connection string name list select your connection string.

    • 4. In the Data Source > AlphaDAO SQL SELECT statement field click to display the SQL SELECT dialog.

    • 5. In the Data Source > Table list select "Customer".

    • 6. In the Data Source > Field to display list select "Bill_City".

    • 7. Select the Filter data? check box.

    • 8. Select "Bill_State_Region" in the Define Filter > Field list.

    • 9. Select "=" in the Define Filter > Operator list.

    • 10. Select "Variable" in the Define Filter > Variable or Constant list.

    • 11. Select "State" in the Define Filter > Variable name list. This expression says that the Bill_City values that are returned will be filtered by the previous selected value of Bill_State_Region.

    • 12. Click OK > OK to return to the Dialog Builder.

    • 13. Enter "width: 2in;" into the DropDownBox Properties > In-line style field.

    • 14. Select "Do nothing" in the DropDownBox Properties > Not in list rule list. This choice prevents the last selection in the drop down list from appearing when the user selects a different value for Bill_State_Region.

  7. Select "Last_Name" in the Selected Controls list.

  8. In the Control Settings > Control type list select "Drop Down Box".

  9. Click the '...' button in the DropDownBox Properties > Choices field.

    • 1. In the Define Choices > List Type field select "Dynamic".

    • 2. In the Data Source > Use saved connection string field select "True".

    • 3. In the Data Source > AlphaDAO Connection string name list select your connection string.

    • 4. In the Data Source > AlphaDAO SQL SELECT statement field click the '...' button to display the SQL SELECT dialog.

    • 5. In the Data Source > Table list select "Customer".

    • 6. In the Data Source > Field to display list select "Lastname".

    • 7. Select the Filter data? check box.

    • 8. Select "Bill_City" in the Define Filter > Field list.

    • 9. Select "=" in the Define Filter > Operator list.

    • 10. Select "Variable" in the Define Filter > Variable or Constant list.

    • 11. Select "City" in the Define Filter > Variable name list. This expression says that the Lastname values that are returned will be filtered by the previous selected value of Bill_City.

    • 12. Click OK > OK to return to the Dialog Builder.

    • 13. Enter "width: 2in;" into the DropDownBox Properties > In-line style field.

    • 14. Select "Do nothing" in the DropDownBox Properties > Not in list rule list. This choice prevents the last selection in the drop down list from appearing when the user selects a different value for Bill_City.

Populating the Lists when Using Microsoft Access

  1. Select "State" in the Selected Controls list.

  2. In the Control Settings > Control type list select "Drop Down Box".

  3. Click the '...' button in the DropDownBox Properties > Choices field.

    • 1. In the Define Choices > List Type field select "Dynamic".

    • 2. In the Data Source > Access filename field select the AlphaSports.mdb database.

    • 3. In the Data Source > SQL SELECT statement field click '...', select "Customer (Table)" in the Table list, select "BILL_STATE_REGION" in the Field to display list, and click OK.

    • 4. Click OK > OK to return to the Dialog Builder.

    • 5. Enter "width: 2in;" into the DropDownBox Properties > In-line style field.

  4. Select "City" in the Selected Controls list.

  5. In the Control Settings > Control type list select "Drop Down Box".

  6. Click the '...' button in the DropDownBox Properties > Choices field.

    • 1. In the Define Choices > List Type field select "Dynamic".

    • 2. In the Data Source > Access filename field select the AlphaSports.mdb database.

    • 3. In the Data Source > SQL SELECT statement field click the '...' button, select "Customer (Table)" in the Table list, select "BILL_CITY" in the Field to display list.

    • 4. Select the Filter data check box.

    • 5. Select "BILL_STATE_REGION" in the Field list.

    • 6. Select "=" in the Operator list.

    • 7. Select "Variable" in the Variable or Constant list.

    • 8. Select "State" in the Variable name list.

    • 9. Click OK > OK to return to the Dialog Builder.

    • 10. Enter "width: 2in;" into the DropDownBox Properties > In-line style field.

    • 11. Select "Do nothing" in the DropDownBox Properties > Not in list rule list. This choice prevents the last selection in the drop down list from appearing when the user selects a different value for Bill_State_Region.

  7. Select "Last_Name" in the Selected Controls list.

  8. In the Control Settings > Control type list select "Drop Down Box".

  9. Click the '...' button in the DropDownBox Properties > Choices field.

    • 1. In the Define Choices > List Type field select "Dynamic".

    • 2. In the Data Source > Access filename field select the AlphaSports.mdb database.

    • 3. In the Data Source > SQL SELECT statement field click the '...' button, select "Customer (Table)" in the Table list, select "LASTNAME" in the Field to display list.

    • 4. Select the Filter data check box.

    • 5. Select "BILL_CITY" in the Field list.

    • 6. Select "=" in the Operator list.

    • 7. Select "Variable" in the Variable or Constant list.

    • 8. Select "City" in the Variable name list.

    • 9. Click OK > OK to return to the Dialog Builder.

    • 10. Enter "width: 2in;" into the DropDownBox Properties > In-line style field.

    • 11. Select "Do nothing" in the DropDownBox Properties > Not in list rule list. This choice prevents the last selection in the drop down list from appearing when the user selects a different value for Bill_City.

Refreshing the Dialog Controls

  1. Display the Form Properties page.

  2. Click the '...' button in the Server Events > AfterValidate field to display the Form Events dialog.

  3. Enter the following Xbasic code and click OK. An explanation of the code is below.

    dim filter as C
    filter = "lastname=" + quote(last_name) + ".and. bill_city = " + quote(city) + ".and. bill_state_region = " + quote(state)
    filter = urlencode(filter)
    Currentform.RedirectTarget ="CascadingLists.a5w?cust_filter=" + filter
  4. Save the dialog as "CascadingLists" and close the Dialog Builder.

  5. Create a new A5W page and save it as "CascadingLists".

  6. Click Insert Component, select the "CascadingLists" dialog component, and click OK.

  7. Change the Alias for the component to "cust".

  8. Click OK.

  9. Click Browser. Your dialog should look something like this.

    images/WPT_Cascading_Lists.gif

Understanding the Xbasic Code

The following expression define a filter for the records displayed in the CascadingLists.a5w page.

dim filter as C
filter = "lastname=" + quote(lastname) + ".and. bill_city = " + quote(city) + ".and. bill_state_region = " + quote(state)

The filter must be URL encoded since it will be passed as a parameter to the CascadingLists.a5w' page.

filter = urlencode(filter)

The CascadingLists.a5w page contains the CascadingLists grid component. When this component was placed on the page, we selected an alias of cust for it. So, in order to pass a parameter to this grid, the parameter name is prefixed with the component alias, followed by an underbar: e.g. cust_filter.

Currentform.RedirectTarget = "CustomerFormEditable.a5w?cust_filter=" + filter